// 创建搜索表单元素
var form = document.createElement('form');
form.className = 'search-form';

// 创建搜索输入框
var input = document.createElement('input');
input.name = 'filter';
input.id = 'search';
input.placeholder = '输入文件名进行搜索...';

// 创建"无结果"提示元素
var noResults = document.createElement('div');
noResults.className = 'no-results';
noResults.textContent = '没有找到匹配的文件';
noResults.style.display = 'none'; // 初始隐藏
noResults.style.textAlign = 'center';
noResults.style.padding = '15px';
noResults.style.color = '#61666c;';

// 将输入框添加到表单中
form.appendChild(input);

// 在标题后插入搜索表单和提示元素
var h1 = document.querySelector('h1');
if (h1) {
    h1.after(form);
    form.after(noResults);
}

// 获取所有文件列表项
var listItems = Array.prototype.slice.call(document.querySelectorAll('tbody tr'));
var table = document.querySelector('table');

// 为输入框添加键盘输入事件监听
input.addEventListener('keyup', function() {
    // 获取搜索关键词并去除前后空格
    var searchText = this.value.trim();
    
    // 如果没有搜索内容，显示所有项目并隐藏提示
    if (!searchText) {
        listItems.forEach(function(item) {
            item.removeAttribute('hidden');
        });
        noResults.style.display = 'none';
        if (table) table.style.display = '';
        return;
    }
    
    // 创建正则表达式，支持多关键词搜索
    // 格式：^(?=.*\b关键词1\b)(?=.*\b关键词2\b).*$
    var keywords = searchText.split(/\s+/); // 按空格分割关键词
    var regexPattern = "^(?=.*\\b" + keywords.join("\\b)(?=.*\\b") + ").*$";
    var regex = RegExp(regexPattern, "i"); // 不区分大小写
    
    // 遍历所有列表项进行筛选
    var hasResults = false;
    listItems.forEach(function(item) {
        // 获取文件名文本内容
        var fileName = item.querySelector('td').textContent.replace(/\s+/g, " ");
        
        // 根据正则表达式测试是否匹配
        if (regex.test(fileName)) {
            item.removeAttribute('hidden'); // 匹配则显示
            hasResults = true;
        } else {
            item.hidden = true; // 不匹配则隐藏
        }
    });
    
    // 根据是否有结果显示提示信息
    if (hasResults) {
        noResults.style.display = 'none';
        if (table) table.style.display = '';
    } else {
        noResults.style.display = 'block';
        if (table) table.style.display = 'none';
    }
});
